<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true" %>
<%@ page session="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ page trimDirectiveWhitespaces="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="application/json; charset=utf-8" />
<title>用户登录</title>
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/reset1.css">
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/index.css">

<link rel="stylesheet" href="${pageContext.request.contextPath }/css/bootstrap.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/style3.css" />
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/bootstrap.min.js" ></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/indexseo.js" ></script>

<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.cookie.js"></script>

<script src="${pageContext.request.contextPath }/js/slider.js"></script>
<script src="${pageContext.request.contextPath }/js/navChange.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.validate.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/messages_zh.js" ></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.cookie.js"></script>


<!--表单校验-->
<script type="text/javascript">
 var redirectUrl = "${redirect}";
  	$(function(){
				$("#userLoginForm").validate({
					rules:{
						username:{
							required:true,
							minlength:6
						},
						password:{
							required:true,
							digits:true,
							minlength:6
						}
					},
					messages:{
							username:{
							required:"用户名不能为空",
							minlength:"至少要输入六个字符"
						},
						password:{
							required:"密码不能为空",
							digits:"密码必须为整数",
							minlength:"密码最小长度为6"
						}
					}
				});
			});
  	
function login() {
	
	var flag = $("#userLoginForm").valid();
    if(!flag){
        //没有通过验证
        return;
    }
    $.post(
    		"<%=basePath%>user/login",
    		$("#userLoginForm").serialize(),
    		function (data) {
    			if(data.status == 200){
    				alert("登录成功!");
    				if(redirectUrl == ""){
    					location.href="<%=basePath%>index/indexlist.html";
    				}else{
    					location.href = redirectUrl;
    				}
    			}else{
    				alert("登录失败!"+data.msg);
    			}
				
			}
    );
}
</script>
<!--<script type="text/javascript">
	$(function(){
		$("#userLoginForm").validate({
			rules:{
			username:{
				required:true,
				minlength:6
			}
		},
		messages:{
			username:{
			required:"用户名不能为空",
			minlength:"至少要输入六个字符"
		   }
		});
		
	});
</script>-->
<style>
body {
	margin-top: 20px;
	margin: 0 auto;
}

.carousel-inner .item img {
	width: 100%;
	height: 300px;
}

.container .row div {
	/* position:relative;
				 float:left; */
	
}

font {
	color: #666;
	font-size: 22px;
	font-weight: normal;
	padding-right: 17px;
  /* Make the image fully responsive */
.carousel-inner img {
     width: 100%;
     height: 100%;
}
</style>

</head>

<body style="overflow-x:hidden">

	<jsp:include page="/WEB-INF/jsp/head.jsp"></jsp:include>
		<!--登录-->
		<div class="container" style="background: url(${pageContext.request.contextPath }/img/rabit.jpg);background-size: cover;width: 100%; height:480px;padding-top: 80px;padding-bottom: 80px;">
			<div class="row">
				<div class="col-lg-7" style="padding-right: 400px;">
				<!--<img src="./image/login.jpg" width="500" height="330" alt="会员登录" title="会员登录">-->
			</div>
			
				<div class="col-lg-5 navbar-right" style="padding-left: 0px;">	
				<div style="width: 440px; border: 1px solid #E7E7E7; padding: 0px 0 20px 30px; border-radius: 5px; margin-top: 0px; background: #fff;">
					<font>用户登录</font>USER LOGIN
					<c:if test="${empty loginInfo}">
					<div></div>
					</c:if>
					<c:if test="${!empty loginInfo}">
					<div>${loginInfo }</div>
					</c:if>
					
					<!--登录表单-->
					<form class="form-horizontal" id="userLoginForm" name="userLoginForm" method="post">
						<div class="form-group">
							<label for="username" class="col-sm-2 control-label">用户名</label>
							<div class="col-sm-6">
								<input type="text" class="form-control" id="username" name="username" placeholder="请输入用户名">
							</div>
						</div>
						
						<div class="form-group">
							<label for="password" class="col-sm-2 control-label">密码</label>
							<div class="col-sm-6">
								<input type="password" class="form-control" id="password" name="password" placeholder="请输入密码">
							</div>
						</div>
						
						
						
						<div class="form-group">
							<div class="col-sm-offset-2 col-sm-4">
								<a href="${pageContext.request.contextPath }/register.html">没有账号?立即注册</a>
							</div>
						</div>
						<div class="form-group">
							<div class="col-sm-offset-2 col-sm-10">
								<button type="button" class="btn btn-primary" onclick="login()">登录</button>
							</div>
						</div>
					</form>
				</div>
			</div>
			</div>
			
		</div>

		<div class="" style="margin: auto;"></div>
		<!--底层-->
		<nav class="navbar-fixed-bottom">
			<header class="header" style="background-color: gainsboro">
		      <div class="container1">
		      	
		        <ul class="nav" style="padding-top: 5px;">
		          <li class="nav" style="display: inline;">
		            <p>CopyRight@201624131105</p>
		          </li>
		        </ul>
		        
		      </div>
		    </header>
		    </nav>

</body>
</html>